<template>
	<view class="mainCont">
		<view class="sider">
			<view v-if="tabNav.length==0" style="text-align: center;font-size: 3rem;line-height: 100rem;">菜单加载中……</view>
			<view class="tab" :class="{'active':active==item.id}" v-for="(item,index) in tabNav" :key='index'
				@click="tab(item.id)">
				<text> {{item.name}}</text>
				<icon v-if="item.error" type="info" size="10" color='red' />
			</view>
		</view>
		<view class="cont">
			<view class="header">
				<view v-if="loanType=='2'" style="font-size: 3.5rem;margin-left: 2rem;font-weight: bold;">
					无还本续贷
				</view>
				<view v-if="loanType=='3'" style="font-size: 3.5rem;margin-left: 2rem;font-weight: bold;">
					续贷（保全）
				</view>
				<view v-else style="font-size: 3.5rem;margin-left: 2rem;font-weight: bold;">

				</view>
				<view style="display: flex;">

					<button v-if="!disabled" type="primary" class="btn2" @click="look(1)">个人征信报告</button>

					<block v-if="appluserType!='1'&&appluserType!='4'">
						<button v-if="!disabled" type="primary" class="btn2" @click="look(2)">企业征信报告</button>
					</block>
					<button v-if="!disabled" :disabled="saveCacheFlag" type="primary" class="btn"
						@click="saveCache">暂存</button>
					<button v-if="!disabled" :disabled="btnDisabled" type="primary" class="btn"
						@click="submit">下一步</button>
				</view>

			</view>
			<scroll-view :scroll-top="scrollTop" scroll-y="true" class="scroll-Y"
				:style="{ height: scrollHeight + 'px' }">
				<view class="form">
					<view class="mark" v-if="disabled&&bankDisabled" :style="{ height: markHeight + 'px' }"></view>
					<activeForm @sceneTypeChange='sceneTypeChange' @saveCache='saveCache' class="activeForm" v-if='show'
						:imgData='imgData' ref='activeForm' :tabId='active' :industry='industry'></activeForm>
				</view>
			</scroll-view>
		</view>

		<!-- 征信报告弹框 -->
		<uni-popup ref="popups" type="dialog" style="width: 70rem;height: 40rem;">
			<uni-popup-dialog @confirm='zxbgcon' title="征信报告" type="info" :duration="2000"
				style="width: 100%;height: 100%;">
				<scroll-view scroll-y="true" style="height: 70rem;">
					<view class="zx" v-append="zxbg" @appended="appended"></view>
				</scroll-view>
			</uni-popup-dialog>
		</uni-popup>
	</view>

</template>

<script>
	import verification from './verification.js'
	import activeForm from '../components/activeForm/index.vue'
	import uniPopupDialog from "@/components/uni-popup-dialog/uni-popup-dialog.vue";
	export default {
		mixins: [verification],
		data() {
			return {
				bankDisabled: true,
				zxbg: '',
				applyType: '1',
				btnDisabled: false,
				saveCacheFlag: false, //缓存控制开关
				show: false,
				disabled: false,
				markHeight: 0,
				imgData: {},
				type: 1,
				title: "Hello",
				active: '1',
				error: [],
				industry: '1',
				scrollTop: 0,
				old: {
					scrollTop: 0
				},
				scrollHeight: 0,
				tabNav: [],
				loanType: '1',
				appluserType: '',
				StdOffsurPromissory: [] //借据信息
			};
		},
		components: {
			activeForm,
		},
		computed: {

		},
		onLoad() {
			uni.getSystemInfo({
				success: (res) => { // 需要使用箭头函数，swiper 高度才能设置成功
					// 获取swiperHeight可以获取的高度，窗口高度减去导航栏高度
					this.scrollHeight = res.windowHeight - 44

				}
			});

			if (getApp().globalData.invState == '2') {
				uni.navigateTo({
					url: '/pages/authorizedList/authorizedList'
				})
			}
			

		},
		onShow() {
			if (getApp().globalData.isBack) {
				console.log(getApp().globalData.imageData)
				getApp().globalData.imageData = getApp().globalData.imageData2
				this.getFormInfo()
			}

		},
		mounted() {
			//直接进入调查表
			if (getApp().globalData.invState == '3') {
				uni.reLaunch({
					url: '/pages/authorizedList/invExcel'
				})


			} else {
				this.getParam()
				if (!getApp().globalData.isBack) {
					this.getFormInfo()
				}
				this.disabled = getApp().globalData.disabled
				//this.getPartnerNo()

			}


		},


		methods: {

			sceneTypeChange(e) { //菜单根据情况变化
				console.log(e)
				//自然人情况下，场景通用和商用车切换变化菜单
				if (getApp().globalData.stdOffsurBaiscInfo.appluserType == 1) {
					if (e == 1) {
						this.tabNav = getApp().globalData.NavData.nav2Pad
						if (!getApp().globalData.isPad) {
							this.removeImgNav()
						}

					} else if (e == 5) {
						this.tabNav = getApp().globalData.NavData.nav1Pad
						if (!getApp().globalData.isPad) {
							this.removeImgNav()
						}

					}
				}

			},
			//菜单点击事件
			tab(id) {
				try {
					//======银行流水PC取消遮罩层==========
					if (id == 7 && !getApp().globalData.isPad) {
						this.bankDisabled = false
					} else {
						this.bankDisabled = true
					}
					//==============
					if (id == 11) {
						if (getApp().globalData.stdOffsurBaiscInfo.sceneType == 1) {
							uni.showToast({
								icon: "none",
								title: "场景【商用车】下,抵押物信息禁止录入",
								duration: 2000
							})
							return false
						}
					}
					this.active = id
					this.imgData = getApp().globalData.imageData
					//console.log(,getApp().globalData.stdOffsurEntBasic.industry)
					let sceneType = getApp().globalData.stdOffsurBaiscInfo.sceneType
					if (sceneType == 1) {
						this.industry = '04'
					} else if (sceneType == 2) {
						this.industry = '01'
					} else if (sceneType == 3) {
						this.industry = '03'
					} else {
						this.industry = getApp().globalData.stdOffsurEntBasic.industry
					}
					this.scrollTop = 0
				} catch {
			
				} finally {
					setTimeout(() => {
			
						if (!getApp().globalData.stdOffsurBaiscInfo.uuid && !this.saveCacheFlag) {
							this.saveCache()
						}
						this.getMarkHeight()
			
					}, 100)
			
				}
			},
			zxbgcon() {
				this.$refs.popups.close()
			},
			//查看征信报告
			look(type) {
				if (type == 1) {
					this.sendRequest({
						url: 'offsur/query/subjectData',
						method: 'post',
						hideLoading: true,
						data: {
							customerType: '1',
							customerSystemId: getApp().globalData.stdOffsurBaiscInfo.customerSystemId,
							reqID: getApp().globalData.stdOffsurBaiscInfo.reqId,
							queryType:'01',
							type: "pad"
						},
						complete: (res2) => {
							console.log(res2)
							if (res2.code == '200') {
								if (!res2.data) {
									uni.showToast({
										icon: "none",
										title: '获取失败，请重试',
										duration: 2000
									})
								} else {
									this.$refs.popups.open()
									let html = res2.data.credit.htmlMessage
									this.zxbg = html
								}


							} else {
								uni.showToast({
									icon: "none",
									title: res2.message,
									duration: 2000
								})
							}
						}
					})
				} else {
                    this.sendRequest({
                    	url: 'offsur/query/subjectData',
                    	method: 'post',
                    	hideLoading: true,
                    	data: {
                    		customerType: '2',
                    		customerSystemId: getApp().globalData.stdOffsurBaiscInfo.entCustomerSystemId,
                    		reqID: getApp().globalData.stdOffsurBaiscInfo.reqId,
                    		queryType:'01',
                    		type: "pad"
                    	},
                    	complete: (res2) => {
                    		console.log(res2)
                    		if (res2.code == '200') {
                    			if (!res2.data) {
                    				uni.showToast({
                    					icon: "none",
                    					title: '获取失败，请重试',
                    					duration: 2000
                    				})
                    			} else {
                    				this.$refs.popups.open()
                    				let html = res2.data.credit.htmlMessage
                    				this.zxbg = html
                    			}
                    		} else {
                    			uni.showToast({
                    				icon: "none",
                    				title: res2.message,
                    				duration: 2000
                    			})
                    		}
                    	}
                    })
				}

			},
			
			//获取原借据号列表
			getIOU() {
				this.sendRequest({
					url: 'offsur/queryDuebillInfo',
					method: 'post',
					hideLoading: true,
					data: {
						reqId: getApp().globalData.reqId,
						loanType: getApp().globalData.stdOffsurBaiscInfo.loanType
					},
					complete: (res) => {
						if (res.code == '200') {
							getApp().globalData.StdOffsurPromissory2 = res.data
						} else {
							uni.showModal({
								title: "提示",
								content: "原借据号列表数据查询失败"
							})
						}
					}
				})
			},
			//获取代码表数据
			getParam() {
				this.sendRequest({
					url: 'vCodeOffsurDict/query',
					method: 'post',
					hideLoading: true,
					data: {},
					complete: (res) => {

						if (res.code == '200') {
							getApp().globalData.optType = res.data
						}
					}
				})
				this.sendRequest({
					url: 'fxt/region',
					method: 'get',
					hideLoading: true,
					data: {},
					complete: (res) => {

						if (res.code == '0') {
							//console.log('房讯通广西地址联动数据：',JSON.parse(res.body))
							getApp().globalData.FxtData = JSON.parse(res.body)
						}
					}
				})
				///collateral/query
				this.sendRequest({
					url: 'collateral/query',
					method: 'post',
					hideLoading: true,
					data: {},
					complete: (res) => {

						if (res.code == '200') {
							//console.log(res.data.children)
							getApp().globalData.ypType = res.data.children
						}
					}
				})
				this.sendRequest({
					url: 'collateral/kdQuery',
					method: 'post',
					hideLoading: true,
					data: {},
					complete: (res) => {
				
						if (res.code == '200') {
							//console.log(res.data.children)
							getApp().globalData.ypKdType = res.data.children
						}
					}
				})
			},
			//获取调查表初始数据
			getFormInfo() {
				this.show = false
				//this.getMarkHeight()
				this.sendRequest({
					url: 'offsur/query',
					method: 'post',
					hideLoading: true,
					data: {
						reqId: getApp().globalData.reqId,
						reuseReqId: getApp().globalData.reuseReqId,
					},
					complete: (res) => {
						if (res.code == '200') {
							this.show = true
							getApp().globalData = Object.assign(getApp().globalData, res.data)
							this.loanType = getApp().globalData.stdOffsurBaiscInfo.loanType
							this.appluserType = getApp().globalData.stdOffsurBaiscInfo.appluserType

							//兼容老数据
							if (getApp().globalData.stdOffsurCollateralContract == undefined) {
								getApp().globalData.stdOffsurCollateralContract = []
							}

							if (!!getApp().globalData.optType) { //判断码表数据是否请求成功
								getApp().globalData.timeout = 0
							}
							//根据条件加载导航
							this.loadTabNav()

							//判断是否有基础信息，设置为只读
							if (!getApp().globalData.stdOffsurIndBasic.idCode) {
								getApp().globalData.indDisabled = false
							} else {
								getApp().globalData.indDisabled = true
							}
							if (!getApp().globalData.stdOffsurEntBasic.creditCode) {
								getApp().globalData.entDisabled = false
							} else {
								getApp().globalData.entDisabled = true
							}

							this.getMarkHeight()
						} else {
							uni.showModal({
								title: "提示",
								content: "数据查询失败，请退出重试！"
							})
						}
					}
				})
				uni.showLoading({
					title: '数据初始加载中……',
					mask: true
				})
				setTimeout(() => {
					uni.hideLoading()
					getApp().globalData.isBack = false
				}, getApp().globalData.timeout + 1000)
			},
			//获取合作方
			getPartnerNo() {
				this.sendRequest({
					url: 'offsur/colony/getPartnerByColonyCode', //'Cim/PartnerManager/queryBasicInfoListForPad',
					method: 'post',
					hideLoading: true,
					data: {
						colonyCode: 1,
						loginName: getApp().globalData.userId
					},
					complete: (res) => {
						if (res.code == '200') {
							getApp().globalData.Partner = res.data.list
						} else {
							uni.showModal({
								title: "提示",
								content: "合作方数据查询失败"
							})
						}
					}
				})
			},

			tabTip(tId) {
				for (let i = 0; i < this.tabNav.length; i++) {
					if (this.tabNav[i].id == tId) {
						this.tabNav[i].errorNun++
					}
				}
			},
			cleanTabTip(tId) {
				for (let i = 0; i < this.tabNav.length; i++) {
					if (this.tabNav[i].id == tId) {
						this.tabNav[i].errorNun = 0
					}
				}
			},
			//缓存
			saveCache() {
				let that = this
				let FormData = that.FormData('hc')

				//StdOffsurPromissory  新增借据信息
				if (getApp().globalData.stdOffsurBaiscInfo.loanType != '1') {
					FormData.stdOffsurPromissoryNote = getApp().globalData.stdOffsurPromissoryNote
				} else {
					FormData.stdOffsurPromissoryNote = []
				}
				that.saveCacheFlag = true
				that.sendRequest({
					url: 'offsur/saveCache',
					method: 'post',
					hideLoading: true,
					data: FormData,
					complete: (res) => {
						setTimeout(() => {
							that.saveCacheFlag = false
						}, 4000)

					}
				})
			},
			

			//提交数据
			subForm() {
				let that = this
				let FormData = that.FormData()
				//进行押品编号去重。
				const newArr = [...getApp().globalData.stdOffsurCollateral03, ...getApp().globalData.stdOffsurCollateral04]
					.map(item => item.mortgageSystemId)
				console.log(newArr)
				const arrSet = new Set(newArr)
				if (arrSet.size !== newArr.length) {
					uni.showToast({
						title: '存在相同押品编号的押品数据，请核对押品信息数据',
						icon: "none",
						duration: 2000
					})

					return false
				}
				uni.showModal({
					title: '提示',
					content: '请确认是否填写完毕，影像资料资料是否补充完整，确认无误点击确定下一步',
					cancelText: '取消',
					confirmText: '确定',
					success(res) {
						if (res.confirm) {

							if (getApp().globalData.stdOffsurEntBasic.industry == '01') {
								FormData.stdOffsurWholesale.industry = '01'
							}
							if (getApp().globalData.stdOffsurEntBasic.industry == '06') {
								FormData.stdOffsurWholesale.industry = '06'
							}
							//StdOffsurPromissory  新增借据信息
							if (getApp().globalData.stdOffsurBaiscInfo.loanType != '1') {
								console.log('111', that.StdOffsurPromissory)
								FormData.stdOffsurPromissoryNote = that.StdOffsurPromissory
							} else {
								FormData.stdOffsurPromissoryNote = []
							}
							//that.btnDisabled = true

							that.sendRequest({
								url: 'offsur/save',
								method: 'post',
								hideLoading: false,
								data: FormData,
								complete: (res) => {
									//console.log(res)
									this.btnDisabled = false
									if (res.code == '200') {
										//getApp().globalData.optType = res.data	
										uni.navigateTo({
											url: "/pages/authorizedList/authorizedList"
										})
									} else {
										uni.showToast({
											title: res.message,
											icon: "none",
											duration: 2000
										})
									}
								}
							})

						}
					}
				})


			},


			//加载导航菜单
			loadTabNav() {
				if (getApp().globalData.stdOffsurBaiscInfo.loanType === '2'||getApp().globalData.stdOffsurBaiscInfo.loanType === '3'){
					this.getIOU()
				}
				
				//判断贷款类型

				if (getApp().globalData.stdOffsurBaiscInfo.loanType == '1'||getApp().globalData.stdOffsurBaiscInfo.loanType == '5') {
					//个人有共借人菜单
					if(getApp().globalData.stdOffsurBaiscInfo.businessType==='1'){
						//判断是都为自然人：只能填写商用车，企业相关信息禁用
						if (getApp().globalData.stdOffsurBaiscInfo.appluserType == 1) {
							if (getApp().globalData.stdOffsurBaiscInfo.sceneType === '4') {
								getApp().globalData.stdOffsurBaiscInfo.sceneType = '5'
							}
							if (getApp().globalData.stdOffsurBaiscInfo.sceneType == '1') {
								this.tabNav = getApp().globalData.NavData.nav2Pad
							} else {
								this.tabNav = getApp().globalData.NavData.nav7Pad
							}
							if (!getApp().globalData.isPad) {
								this.removeImgNav()
							}
						
						
						} else {
							this.tabNav = getApp().globalData.NavData.nav7Pad
							if (!getApp().globalData.isPad) {
								this.removeImgNav()
							}
						}
						
					}else{ //企业
						this.tabNav = getApp().globalData.NavData.nav1Pad
						if (!getApp().globalData.isPad) {
							this.removeImgNav()
						}
						
					}
					
				} else if (getApp().globalData.stdOffsurBaiscInfo.loanType == '2') {
					//this.active = '2'

					if (getApp().globalData.stdOffsurBaiscInfo.businessType == '1') { //自然人1 不能申请2 ，3
						
						
						if (getApp().globalData.stdOffsurBaiscInfo.appluserType == 1) {
							getApp().globalData.stdOffsurBaiscInfo.sceneType = '1'
							this.tabNav = getApp().globalData.NavData.nav4Pad
						
						} else {
							this.tabNav = getApp().globalData.NavData.nav31Pad	
						}
						
						if (!getApp().globalData.isPad) {
							this.removeImgNav()
						}
					} else {
						this.tabNav = getApp().globalData.NavData.nav3Pad
						if (!getApp().globalData.isPad) {
							this.removeImgNav()
						}
					}

				} else if (getApp().globalData.stdOffsurBaiscInfo.loanType == '3') {
					//this.active = '2'

					if (getApp().globalData.stdOffsurBaiscInfo.businessType == '1') {
						if (getApp().globalData.stdOffsurBaiscInfo.appluserType == 1) {
							getApp().globalData.stdOffsurBaiscInfo.sceneType = '1'
							this.tabNav = getApp().globalData.NavData.nav6Pad
						
						} else {
							this.tabNav = getApp().globalData.NavData.nav51Pad	
						}
						
						if (!getApp().globalData.isPad) {
							this.removeImgNav()
						}
					} else {
						this.tabNav = getApp().globalData.NavData.nav5Pad
						if (!getApp().globalData.isPad) {
							this.removeImgNav()
						}
					}
				}else if (getApp().globalData.stdOffsurBaiscInfo.loanType == '4'){
					// 快贷特殊处理
					this.active = '2'
					getApp().globalData.stdOffsurBaiscInfo.sceneType === '4'
					this.tabNav = getApp().globalData.NavData.nav8Pad
					if (!getApp().globalData.isPad) {
						this.removeImgNav()
					}
					
				}

			},
			//pc删除影像
			removeImgNav() {
				for (let i = 0; i < this.tabNav.length; i++) {
					if (this.tabNav[i].name === '影像上传') {
						this.tabNav.splice(i, 1)
					}
				}

			},
			getMarkHeight(res) {
				setTimeout(() => {
					let _this = this
					let view1 = uni.createSelectorQuery().select(".form")
					view1.boundingClientRect(data => {
						_this.markHeight = data.height
					}).exec()
					let view = uni.createSelectorQuery().select(".activeForm")
					view.boundingClientRect(data => {
						_this.markHeight = data.height
					}).exec()

				}, 50)
			},
			
		},
	};
</script>

<style lang="scss">
	.mainCont {
		display: flex;
		justify-content: flex-end;
		position: relative;
		background: #FFFFFF;
	}

	.sider {
		width: 16%;
		height: 100%;
		padding: 1rem;
		box-sizing: border-box;
		top: 0;
		left: 0;

		.tab {
			font-size: 3rem;
			padding: 2rem 3rem;
			cursor: pointer;
			display: flex;
			align-items: center;
			justify-content: space-between;

			text {
				margin-right: 1rem;
			}
		}

		// .tab:hover {
		// 	background: #007AFF;
		// 	color: #FFFFFF;
		// }

		.active {
			background: #007AFF;
			color: #FFFFFF;
		}
	}

	.cont {
		width: 84%;

		.header {
			width: 100%;
			height: 44px;
			display: flex;
			flex-direction: row;
			align-items: center;
			justify-content: space-between;
			border-bottom: 1px solid #DDDDDD;
			border-left: 1rem solid #DDDDDD;
			box-sizing: border-box;
			overflow: hidden;

			.btn {
				width: 20rem;
				height: 8rem;
				line-height: 8rem;
				font-size: 2.8rem;
				margin-right: 5rem;
			}

			.btn2 {
				width: 26rem;
				height: 8rem;
				line-height: 8rem;
				font-size: 2.8rem;
				margin-right: 5rem;
			}
		}

	}

	.scroll-Y {
		border-left: 1rem solid #dddddd;

		.form {

			height: 100%;
			padding: 3rem;
			//box-sizing: border-box;
		}

		.mark {
			width: 100%;
			height: 100%;
			min-height: 1000px;
			background: RGB(240, 240, 240, 0.2);
			position: absolute;
			z-index: 999;
		}
	}

	.zx {
		width: 200rem;
		height: 100rem;
	}
</style>
